import styles from './goodsCard.module.scss';

const GoodsCard = ({ imageUrl = '/images/homeItem.svg', name = '物品名称', time = '50分钟前', category = '物品类别', status = '已借出' }) => {
    return (
        <div className={styles.goodsCard}>
            <div className={styles.goodsCard__image}>
                {imageUrl ? (
                    <img src={imageUrl} alt={name} />
                ) : (
                    <div className={styles.goodsCard__placeholder}>
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor">
                            <path d="M19 3H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V5a2 2 0 00-2-2zm0 16H5V5h14v14zm-5.04-6.71l-2.75 3.54-1.96-2.36L6.5 17h11l-3.54-4.71z" />
                        </svg>
                    </div>
                )}
            </div>
            <div className={styles.goodsCard__info}>
                <div className={styles.goodsCard__meta}>
                    <span className={styles.goodsCard__name}>{name}</span>
                    <span className={styles.goodsCard__status}>{status}</span>
                </div>
                <div className={styles.goodsCard__meta}>
                    <span className={styles.goodsCard__time}>{time}</span>
                    <span className={styles.goodsCard__category}>{category}</span>
                </div>
            </div>
        </div>
    );
};

export default GoodsCard; 